<template>
    <view id="personal_data">
        <view class="top">
            <i></i>
            <span class="fs_32 c_333 fw_600" @click="handleLogin">跳过</span>
        </view>
        <view class="text"></view>
        <view class="content">
            <view class="fw_600 c_333 h1">姓名</view>
            <view class="input_box">
                <input
                    type="text"
                    maxlength="10"
                    placeholder="请输入昵称"
                    v-model="name"
                />
                <view class="iconfont icon-guanbi1" v-if="name" @click.stop="handelClean"></view>
            </view>
            <view class="p">
                <span class="label c_333 fw_600">实力展示</span>
                <span v-if="option.id == 2" class="tip"
                    >（上传营业执照更容易获得别人的信任）</span
                >
                <span v-else class="tip">（营业执照或身份证任选一种）</span>
            </view>
            <view
                v-if="option.id == 2"
                class="upload_box needsclick"
                @click="handleUpload()"
            >
                <image
                    class="license needsclick"
                    v-show="licenseSrc"
                    :src="licenseSrc"
                />
                <image
                    class="icon_bg needsclick"
                    v-show="!licenseSrc"
                    src='https://oss-shop.cciinet.com/files/MiniProgram/ID_add.png'
                />
            </view>
            <view v-else class="upload_box needsclick" @click="handleChooseImg">
                <image
                    class="license needsclick"
                    v-show="licenseSrc"
                    :src="licenseSrc"
                />
                <image
                    class="icon_bg needsclick"
                    v-show="!licenseSrc"
                    src="https://oss-shop.cciinet.com/files/MiniProgram/zhizhao_add.png"
                />
            </view>
        </view>
        <button class="btn fs_32" @click="handleSubmit()">提交</button>
    </view>
</template>

<script>

import { getUploadImage } from "@/api/common/index";
import { updateCompanyUserById, checkUserStatus } from "@/api/login/index";
import { saveGuideOperate } from "@/api/shop/index.js";
export default {
    data() {
        return {
            name: "",
            licenseSrc: "",
			option:"",
        };
    },
    onLoad(option) {
		this.option = option
		console.log(this.option)
        this.handelGetData()
    },
    methods: {
        handelGetData(stu=2) {
			let info = JSON.parse(uni.getStorageSync("userInfo"))
            checkUserStatus({companyId:"", userId:info.user.id}).then((res) => {
                if(res.code===0) {
                    this.name=res.data.user.name,
                    this.licenseSrc = res.data.shopCompany.businessLicenseImage
                    if(stu==1) {
                        this.handleSaveLoginInfo(res)
                    }
                }
            });
        },
		handelClean() {
			console.log()
			this.name=''
		},
        // 更新登录信息 跳转页面
        handleSaveLoginInfo(res) {
          uni.setStorageSync('userId', res.data.user.id)
          uni.setStorageSync('userInfo', JSON.stringify(res.data))
          this.handleLogin()
            
        },
        handleSubmit() {
            if (!this.name) {
				this.uni.showToast({
					title: '请输入您的昵称',
					icon:'none'
				});
                return;
            }
			let info = JSON.parse(uni.getStorageSync("userInfo"))
            updateCompanyUserById({
                businessLicenseImage: this.licenseSrc,
                examineType: this.licenseSrc?0:-1,
                id:info.shopCompany
                    ? info.shopCompany.id
                    : '',
                userId: info.user
                    ? info.user.id
                    : '',
                userName: this.name,
            }).then((res) => {
                if (res.code === 0) {
                    this.handelGetData(1)
                }
            });
			if (this.option.release_stu == '1') {
				saveGuideOperate({
					userId: uni.getStorageSync("userId"),
					type: "200"
				})
			}
        },
        // 登录
        handleLogin() {
            if (uni.getStorageSync("userId")) {
               this.$handleOpenUrl("/pages/home/index",0)
            }
        },
		handleChooseImg() {
			uni.chooseImage({
				count: 1,
				// sizeType:  original 原图，compressed 压缩图，默认二者都有
				sizeType: "original",
				success: res => {
					let size = parseFloat(res.tempFiles[0].size/1024/1024).toFixed(2)
					if(size>10) {
						uni.showToast({
							title:'请上传10M以内的图片',
							icon:'none'
						})
						return
					}
					console.log(size)
					getUploadImage({
						file: res.tempFilePaths[0],
						formData: {
							'waterFlag':true
						}
					}).then(response => {
						let data = JSON.parse(response)
						if (data.code == 0) {
							console.log(data.data.url)
							this.licenseSrc = data.data.url
						}
					})
					// uni.previewImage({
					// 	// 对选中的图片进行预览
					// 	urls: res.tempFilePaths,
					// })
				}
			});
		},
    },
};
</script>

<style lang="scss" scoped>
#personal_data {
    height: 100%;
    background: url("https://oss-shop.cciinet.com/files/MiniProgram/qita_bg.png") no-repeat;
    background-size: contain;
    .top {
        height: 100upx;
        margin: 0 50upx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .icon {
            display: inline-block;
            height: 42upx;
            width: 24upx;
            background: url("https://oss-shop.cciinet.com/files/MiniProgram/back_666.png") no-repeat center center;
            background-size: 100% 100%;
        }
    }
    .text {
        height: 120upx;
        width: 455upx;
        margin: 0 50upx 32upx;
        background: url("https://oss-shop.cciinet.com/files/MiniProgram/bg999.png") no-repeat;
        background-size: 100% 100%;
    }
    .content {
        padding: 0 50upx;
        margin: 140upx 0 0;
        .h1 {
            font-size: 30upx;
            margin-bottom: 34upx;
        }
        .input_box {
            position: relative;
            input {
                height: 80upx;
                width: 650upx;
                font-size: 32upx;
                border-bottom: 2upx solid #d0d2d7;
                background-color: transparent;
            }
            .icon-guanbi1 {
                position: absolute;
                top: 20upx;
                right: 50upx;
                color: #000;
                font-size: 34upx;
				z-index: 99;
            }
        }
        .p {
            margin-top: 60upx;
            .label {
                font-size: 30upx;
            }
            .tip {
                font-size: 30upx;
                color: #9fa1a5;
            }
        }
        .upload_box {
            height: 310upx;
            width: 486upx;
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 30upx auto 0;
            .license {
                max-height: 100%;
                max-width: 100%;
            }
            .icon_bg {
                height: 100%;
            }
        }
    }
    .btn {
        height: 90upx;
        width: 650upx;
        margin: 100upx auto 0;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        background: linear-gradient(#ff9109, #ff5804);
        border-radius: 45upx;
    }
}
</style>